<template>
  <div>
    <TopFilter :list="topFilterList" :cols="4" :labelWidth="120" @onCollapse="collapseHandle" @filterChange="changeHandle" />
    <button-area :style="{ paddingLeft: '80px' }"></button-area>
    <FilterTable
      ref="table"
      columnsRef="partPartPurchaseUndeliveredBatchCancelIndex"
      :columns="tableColumns"
      :onRowSelectChange="handleRowSelectChange"
      :datakey="'rows'"
      :dataSource="dataSource"
      :isMemoryPagination="true"
      :isSelectColumn="true"
      selectionType="single"
      :onColumnsChange="columns => (this.tableColumns = columns)"
      :isExportExcel="true"
      :onCalcExportData="exportFun"
      exportFileName="配件已确认但未发货清单.xlsx"
    >
      <template slot="controls"> </template>
    </FilterTable>

    <!-- 供应商选择 -->
    <BaseDialog :visible.sync="quertR3DialogVisible" title="查看r3日志" destroyOnClose :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <queryR3Dialog :billNo="checkR3LogBillNo" @close="quertR3DialogVisible = false" />
    </BaseDialog>
    <!-- 新建采购订单一级抽屉 -->
  </div>
</template>

<script>
import { messageAction } from '@/utils';
import { dictionary } from '@/utils/dictMixin';
import moment from 'moment';

import { queryOrderList, queryAllOrderTypeInfo, uploadOrder } from '@/api/part/partPurchase/purchaseOrder';
import { queryUndeliveredList } from '@/api/part/partPurchase/undeliveredBatchCancel';
import queryR3Dialog from './main/queryR3Dialog';

export default {
  name: 'partPurchaseOrderQuery',
  components: {
    queryR3Dialog
  },
  mixins: [dictionary],
  data() {
    return {
      topFilterList: this.createTopFilterList(),
      tableColumns: this.createTableColumns(),

      quertR3DialogVisible: false, // 是否显示查看r3日志
      fetchapi: queryUndeliveredList,
      fetchParams: { xhrAbort: true },
      orderTypeList: [], // 订单类型列表(回显用)
      selectedList: [], // 选中的订单列表
      partList: [], // 传递给编辑/新建订单的配件列表
      checkR3LogBillNo: '', // 查看r3日志的订单编号
      dataSource: [] //
    };
  },
  created() {
    this.queryAllOrderTypeInfoList();
  },
  mounted() {
    // 分页
    this.BaseTable = this.$refs.table.$refs.pageTable;
  },
  methods: {
    exportFun(row) {
      for (const key in row) {
        switch (key) {
          case 'AUART':
            row[key] = this.orderTypeList[row.AUART];
            break;
          case 'ERDAT':
            row[key] = row.ERDAT.substring(0, 10);
          default:
            break;
        }
      }
    },
    createTopFilterList() {
      return [
        {
          type: 'RANGE_DATE',
          fieldName: 'I_QERDATS|I_QERDARE',
          label: '采购订单申请日期'
        },

        {
          type: 'RANGE_DATE',
          fieldName: 'I_SERDATS|I_SERDARE',
          label: '制单日期'
        },
        {
          type: 'SELECT',
          label: '订单类型',
          fieldName: 'I_AUART',
          placeholder: '请选择...',
          itemList: this.createDictList(8133)
        }
      ];
    },
    createTableColumns() {
      return [
        {
          title: '需求日期',
          dataIndex: 'ERDAT',
          sorter: true,
          filter: true,
          filterType: 'date-range',
          dateFormat: 'yyyy-MM-dd',
          showOverflowTooltip: true
        },

        // {
        //   title: '订单类型',
        //   dataIndex: 'originalOrderType',
        //   render: params => {
        //     return <span>{this.orderTypeList[params.row.originalOrderType]}</span>;
        //   }
        // },
        // {
        //   title: '订单状态',
        //   dataIndex: 'vOrderStatus',
        //   render: params => {
        //     return <span>{this.createDictText(params.row.vOrderStatus, 8133)}</span>;
        //   }
        // },
        {
          title: 'R3采购单号',
          sorter: true,
          filter: true,
          filterType: 'input',
          showOverflowTooltip: true,
          dataIndex: 'VBELN'
        },
        {
          title: '订单类型',
          dataIndex: 'AUART',
          filter: true,
          filterType: 'input',
          showOverflowTooltip: true,
          sorter: true,
          render: params => {
            return <span>{this.orderTypeList[params.row.AUART]}</span>;
          }
        },
        {
          title: '采购订单编号',
          sorter: true,
          showOverflowTooltip: true,
          filter: true,
          filterType: 'input',
          dataIndex: 'DHH'
        },
        {
          title: '行项',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'input',
          dataIndex: 'POSNR'
        },
        {
          title: '配件代码',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'input',
          dataIndex: 'MATNR'
        },
        // {
        //   title: '性质',
        //   dataIndex: 'vProperties'
        // },
        {
          title: '配件名称',
          sorter: true,
          filter: true,
          filterType: 'input',
          showOverflowTooltip: true,
          dataIndex: 'ARKTX'
        },
        {
          title: '含税采购单价',
          width: '150px',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'number',
          precision: 2,
          dataIndex: 'KBETR1'
        },
        {
          title: '不含税采购单价',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'number',
          precision: 2,
          dataIndex: 'KBETR'
        },
        {
          title: '订货数量',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'number',
          precision: 2,
          dataIndex: 'KWMENG'
        },
        {
          title: '已处理数量',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'number',
          showOverflowTooltip: true,
          precision: 2,
          dataIndex: 'OKQTY'
        },

        {
          title: '待处理数量',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'number',
          precision: 2,
          dataIndex: 'NOTQTY'
        },
        {
          title: '状态',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'input',
          dataIndex: 'STATUS'
        },
        {
          title: '底盘号',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'input',
          dataIndex: 'VIN'
        },
        {
          title: '紧急',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'input',
          dataIndex: 'ZFLAG'
        }
        // ,
        // {
        //   title: '已发315',
        //   dataIndex: 'dConfirm'
        // }
      ];
    },
    // 点击查看r3日志
    handleCheckR3Log() {
      if (this.selectedList.length) {
        this.checkR3LogBillNo = this.selectedList[0].orderNo;
        this.quertR3DialogVisible = true;
      } else {
        messageAction('请选择需要查看的订单', 'warning');
      }
    },
    // 查询所有订单类型
    async queryAllOrderTypeInfoList() {
      let res = await queryAllOrderTypeInfo();
      let obj = {};
      res.data.map(item => {
        if (item.partTypeNo == 'AG') {
          obj[item.partTypeNo] = '普通订单';
        } else {
          obj[item.partTypeNo] = item.partTypeName;
        }
      });
      // console.log(obj, '订单类型');

      this.orderTypeList = obj;
      this.topFilterList.find(item => item.fieldName === 'I_AUART').itemList = res.data.map(x => ({ text: x.partTypeName, value: x.partTypeNo }));
    },
    handleRowSelectChange(e) {
      this.selectedList = e;
    },
    // 供应商选择点击确定
    handleDealerSelectConfirm(e) {
      this.topFilterList.find(item => item.fieldName == 'vSupplyId').initialValue = e.customerCode;
    },
    async changeHandle(val) {
      this.fetchParams = Object.assign({}, val);
      try {
        this.$refs.table.START_LOADING;
        let res = await queryUndeliveredList(this.fetchParams);
        this.dataSource = [];
        this.dataSource = res.data;
      } catch (error) {
      } finally {
        this.$refs.table.STOP_LOADING;
      }
    },
    collapseHandle() {
      this.$nextTick(() => {
        this.BaseTable.EXECUTE_RESET_HEIGHT();
      });
    },
    closeHandler(val, type) {
      // 关闭
      this.visible = val;
      if (type === 'refresh') {
        // 重新加载
        this.fetchParams = { ...this.fetchParams };
      }
    },

    // 点击上传
    async handleUpload() {
      if (this.selectedList.length) {
        let res = await uploadOrder({
          partNo: this.selectedList[0].partNo
        });
        if (res.resultCode == 200) {
          messageAction('上传成功', 'success');
        }
      }
    }
  }
};
</script>

<style lang="less" scoped></style>
